<template>
  <div class='search'>
    <f-drawer ref='salemanDrawer' :title='drawerTitle' width='70%' @submit='handleSubmit' @visibleChange='visibleChange'>
      <a-tabs @tabClick='tabClick' :defaultActiveKey='current' v-model='current' :animated='false'>
        <a-tab-pane tab='基本信息' key='form1'>
          <saleman-zs-form ref='form1' v-if='drawerVisible'></saleman-zs-form>
        </a-tab-pane>
        <a-tab-pane tab='资信信息' key='form2' v-if='isEdit'>
          <saleman-simple-form ref='form2' v-if='drawerVisible'></saleman-simple-form>
        </a-tab-pane>
        <a-tab-pane tab='银行账户' key='form3' v-if='isEdit'>
          <sale-man-bank ref='form3' v-if='drawerVisible'></sale-man-bank>
        </a-tab-pane>
      </a-tabs>
    </f-drawer>
  </div>
</template>
<script>
import salemanZsForm from "./saleman_zs_form.vue"
import SaleManBank from "./saleman_bank"
import SalemanSimpleForm from "./saleman_simple_form"

export default {
  name: "salemanZsDrawer",
  props: {},
  data() {
    return {
      refs: this.$refs,
      drawerVisible: false,
      isEdit: false,
      title: "业务员详情",
      current: "form1",
      formData: {},
      forms: [
        "form1",
        "form2"
      ]
    }
  },
  methods: {
    showDrawer(data) {
      this.isEdit = false
      if (data && data.saleManId) {
        this.isEdit = true
        this.formData = data
      } else {
        this.formData = { deptId: data.deptId }
      }
      this.refs["salemanDrawer"].show()
      this.tabClick("form1")
    },
    handleSubmit(callback) {
      this.refs[this.current].handleSubmit(callback)
    },
    visibleChange(drawerVisible) {
      this.$emit("success")
      this.drawerVisible = drawerVisible
    },
    tabClick(name) {
      this.current = name
      if (this.current === "form1") {
        this.title = this.isEdit ? "编辑业务员" : "添加业务员"
      }
      this.$nextTick(() => {
        this.refs[this.current].setData(this.formData)
      })
    }
  },
  computed: {
    drawerTitle: function() {
      return this.title
    }
  },
  created() {
  },
  components: { SalemanSimpleForm, SaleManBank, salemanZsForm }
}
</script>

<style scoped lang='less' rel='stylesheet/less'>

</style>
